import React, { FC, ReactElement } from 'react';
import { View, Text, Image } from '@tarojs/components';
import { styled } from 'linaria/react';
import { useClassName } from '@/utils/index';
export interface IProps extends ICompProps {
    title: string;
    content: string;
    iconCode: ReactElement;
}
Card.defaultProps = {} as Partial<IProps>;
function Card(props: IProps) {
    const { className, style, title, content, iconCode } = props;
    const localClassName = useClassName('Card', className);
    return (
        <RootView className={localClassName} style={style}>
            <View className="header">
                {/* <Image src={require('@/assets/images/mine-order.png')} className="icon"></Image> */}
                <Text className="icon iconfont">{iconCode}</Text>
                <Text className="title">{title}</Text>
            </View>
            <View className="footer">{content}</View>
        </RootView>
    );
}
export default React.memo(Card as FC<IProps>);
const RootView = styled(View)`
    &.Card {
        padding: 30px 0;
        .header {
            display: flex;
            align-items: center;
            padding-bottom: 10px;
            .title {
                font-size: 30px;
                font-weight: 400;
                color: #808a9d;
            }
            .icon {
                font-size: 40px;
                line-height: 40px;
                margin-right: 10px;
            }
        }
        .footer {
            font-size: 34px;
            font-weight: 500;
            color: #333333;
        }
    }
`;
